<script></script>

<template>
  <el-link :href="link">你好</el-link>
  <el-button type="primary" @click="testDownloadFileSample"
    >测试直接下载</el-button
  >
  <elec-file-link :href="link" />
</template>

<script setup>
import { ref } from "vue";
const link = ref(
  "http://localhost:8080/media/file/pdf/67518922f52a17226cea2fd1"
);

// 将在服务器端得到的字节流 在客户端直接保存为文件
const testDownloadFileSample = () => {
  const str = "http://localhost:8080/media/file/pdf/67518922f52a17226cea2fd1";
  fetch(str)
    .then((response) => response.blob())
    .then((blob) => {
      const url = URL.createObjectURL(blob);
      const link = document.createElement("a");
      link.href = url;
      link.download = "filename.pdf";
      document.body.appendChild(link);
      link.click();
      URL.revokeObjectURL(url);
      document.body.removeChild(link);
    })
    .catch((error) => console.error("Error fetching PDF:", error));
};
</script>

<style lang="scss"></style>a